import React, { Component } from 'react'
import axios from 'axios'

export default class Products extends Component {

  constructor() {
    super();
    this.state = {
      datalist: []
    }
  }

  sum() {
    let total = this.state.datalist.reduce((pre, cur, index) => {
      return pre += Number(cur.price);
    }, 0)
    return total;
  }

  render() {
    return (
      <div>
        <ul>
          {
            this.state.datalist.map((item) => {
              return (
                <li key={item.id}>{item.name}</li>
              )
            })
          }

        </ul>
        <hr />
        total:{this.sum()}
      </div>
    )
  }


  async componentDidMount() {
    let rs = await axios.get('http://localhost:8088/api/goodslist', {})
    this.setState({
      datalist: rs.data
    })
  }

}
